<template>
  <el-dialog
    v-dialogDrag
    title="提示"
    :visible.sync="isViewPopWindows"
    width="70%"
    @close="close"
    :append-to-body="true"
    :close-on-click-modal="false"
    @opened="open"
    center
    ref="isPopWindows"
  >
    <dialogHeader
      slot="title"
      title="查看出库明细"
      :style-type="$store.state.app.dialogType"
    />
    <div class="formBoxContain">
      <!-- 
            buttons: 按钮
            froms: 表单
            fromsField: 表单对应的字段
            tableOption: 网格项
            dynamicApiConfigs: 取值
         -->

      <one-table-template
        ref="multipleTable"
        :dynamic-buttons="tableButtons"
        :dynamic-components="tableComponents"
        :dynamic-form-fields="formField"
        :dynamic-table-cols="tableCols"
        :dynamic-is-show-select="true"
        :dynamic-is-show-more-btn="true"
        :dynamic-is-init-table="true"
        :isShowPagination="false"
      />
    </div>
  </el-dialog>
</template>

<script>
import dialogHeader from "@/components/dialogHeader";
import OneTableTemplate from "@/components/templates/oneTable";
import api from "@/api/vehicleManagement";
import { vehiclePdiPriceInquirys } from "@/api/se/vehiclePdiPriceInquiry";
import { exportExcel } from "@/utils/getTimeString.js";

export default {
  components: {
    dialogHeader,
    OneTableTemplate,
  },
  props: {
    // 是否关闭弹窗
    isViewPopWindows: {
      type: Boolean,
      default: false,
    },
    dynamicEditRowData: {
      type: Object,
      default: function () {
        return {};
      },
    },
  },
  data() {
    // 页面标识（与上面beforeRouteEnter中的对应）
    const viewPageCode = this.$route.path;

    // 绑定事件配置化事件
    this.$ConfigCache.CacheConfig.bindEvent(this, [viewPageCode]);
    return {
      dynamicApiConfigs: "",
      tableComponents:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents.length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
              .tableComponents
          : [
              {
                compKey: "compKey1",
                labelName: "申请单号:",
                codeField: "applyOrderCode",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMust: true,
                disabled: true,
                span: 6,
              },
              {
                compKey: "compKey2",
                labelName: "出库类型:",
                codeField: "outboundTypeCn",
                lookuptype: "VE0185",
                component: () => import("@/components/org/LookupValue"),
                type: "dropdownList",
                disabled: true,
                isMust: true,
                span: 6,
              },
              {
                compKey: "compKey3",
                labelName: "领用去向：",
                codeField: "applyDept",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMul: false,
                isMust: true,
                disabled: true,
                span: 6,
              },
              {
                compKey: "compKey6",
                labelName: "成本中心:",
                codeField: "costCentre",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMust: true,
                disabled: true,
                span: 6,
              },
              {
                compKey: "compKey4",
                labelName: "申请人：",
                codeField: "applyPerson",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMul: false,
                isMust: true,
                disabled: true,
              },
              {
                compKey: "compKey4",
                labelName: "出库用途：",
                codeField: "applyUse",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMul: false,
                isMust: true,
                disabled: true,
              },
              {
                compKey: "compKey5",
                labelName: "收货人:",
                codeField: "receivePerson",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMust: true,
                disabled: true,
                span: 6,
              },
              {
                compKey: "compKey6",
                labelName: "联系电话:",
                codeField: "linkPhone",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMust: true,
                disabled: true,
                span: 6,
              },

              {
                compKey: "compKey6",
                labelName: "收货地址:",
                codeField: "receiveAddress",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMust: true,
                disabled: true,
                span: 12,
              },
              {
                compKey: "compKey6",
                labelName: "出库仓库:",
                codeField: "warehouseName",
                lookuptype: "VE0185",
                component: () => import("@/components/org/LookupValue"),
                type: "dropdownList",
                isMust: true,
                disabled: true,
                span: 6,
              },
              {
                compKey: "compKey6",
                labelName: "申请日期:",
                codeField: "applyDate",
                component: () => import("@/components/org/commonInput"),
                type: "inputText",
                isMust: true,
                disabled: true,
                span: 6,
              },
            ],
      formField: this.$utils.getFormField(this, {
        applyOrderCode: "",
        outboundTypeCn: "",
        applyDept: "",
        costCentre: "",
        applyPerson: "",
        applyUse: "",
        receivePerson: "",
        linkPhone: "",
        receiveAddress: "",
        warehouseName: "",
        applyDate: "",
      }),

      // 动态组件-按钮
      tableButtons: [
        {
          compKey: "button1",
          type: "primary",
          size: "small",
          name: "",
          clickEvent: () => this.pass(),
          text: "审核",
          position: "right",
        },
        {
          compKey: "button1",
          type: "primary",
          size: "small",
          name: "",
          clickEvent: () => this.reject(),
          text: "驳回",
          position: "right",
        },
      ],
      // 动态生成网格列
      tableCols:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          .length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          : [
              {
                prop: "partNo",
                label: "备件编码",
                align: "center",
              },
              {
                prop: "partName",
                label: "备件名称",
                align: "center",
              },
              {
                prop: "storageLocation",
                label: "仓位编码",
                align: "center",
              },
              {
                prop: "unit",
                label: "备件单位",
                align: "center",
              },
              {
                prop: "theoryUsableStorage",
                label: "理论可用库存",
                align: "center",
              },
              {
                prop: "saleQty",
                label: "申请数量",
                align: "center",
              },
            ],
    };
  },
  methods: {
    /**
     * @description 关闭弹窗
     * @time 2021、01、22
     */
    close() {
      this.$emit("close");
    },
    open() {
      this.formField.applyDept = this.dynamicEditRowData.applyDept;
      this.formField.applyOrderCode = this.dynamicEditRowData.applyOrderCode;
      this.formField.outboundTypeCn = this.dynamicEditRowData.outboundTypeCn;
      this.formField.costCentre = this.dynamicEditRowData.costCentre;
      this.formField.applyPerson = this.dynamicEditRowData.applyPerson;
      this.formField.applyUse = this.dynamicEditRowData.applyUse;
      this.formField.receivePerson = this.dynamicEditRowData.receivePerson;
      this.formField.linkPhone = this.dynamicEditRowData.linkPhone;
      this.formField.receiveAddress = this.dynamicEditRowData.receiveAddress;
      this.formField.warehouseName = this.dynamicEditRowData.warehouseName;
      this.formField.applyDate = this.dynamicEditRowData.applyDate;
      const queryObj = {
        // 保存mutation
        type: "mutation",
        // api配置
        apiConfig: vehiclePdiPriceInquirys.findAuditOtherOutboundD,
        // 条件/实体参数（变量），根据typeParam中的定义配置
        variables: {
          applyOrderId: this.dynamicEditRowData.applyOrderId,
        },
      };
      // 转换了中台请求格式数据
      var paramD = this.$getParams(queryObj);
      // 调用中台API方法（可复用）
      this.$requestAPI(paramD).then((response) => {
        this.$refs.multipleTable.list = response.rows;
      });
    },
    // 通过
    pass() {
      let that = this;
      const queryObj = {
        // 保存mutation
        type: "mutation",
        // api配置
        apiConfig: vehiclePdiPriceInquirys.auditPass,
        // 条件/实体参数（变量），根据typeParam中的定义配置
        variables: [{ applyOrderId: this.dynamicEditRowData.applyOrderId }],
      };
      // 转换了中台请求格式数据
      var paramD = that.$getParams(queryObj);
      // 调用中台API方法（可复用）
      that.$requestAPI(paramD).then((response) => {
        if (response.result === "1") {
          this.$message({
            message: "已通过",
            type: "success",
            duration: 2000,
          });
          this.open();
          this.isViewPopWindows = false;
        } else {
          // 保存失败
          this.$message({
            message: "保存失败",
            type: "warn",
            uration: 2000,
          });
        }
      });
    },
    // 驳回
    reject() {
      let that = this;
      const queryObj = {
        // 保存mutation
        type: "mutation",
        // api配置
        apiConfig: vehiclePdiPriceInquirys.auditReject,
        // 条件/实体参数（变量），根据typeParam中的定义配置
        variables: [{ applyOrderId: this.dynamicEditRowData.applyOrderId }],
      };
      // 转换了中台请求格式数据
      var paramD = that.$getParams(queryObj);
      // 调用中台API方法（可复用）
      that.$requestAPI(paramD).then((response) => {
        if (response.result === "1") {
          this.$message({
            message: "已驳回",
            type: "success",
            duration: 2000,
          });
          this.open();
          this.isViewPopWindows = false;
        } else {
          // 保存失败
          this.$message({
            message: "保存失败",
            type: "warn",
            uration: 2000,
          });
        }
      });
    },
  },
};
</script>
<style scoped>
.formBoxContain {
  height: 600px;
}
</style>